<template>
  <div class="head">
    <text>随心享</text>
    <button
      style="float: right; display: flex; margin-top: -30px; font-size: 20px"
      @click="outlogin"
    >
      退出
    </button>
  </div>
  <div>
    <el-card
      class="box-card"
      shadow="never"
      v-for="(item, index) in foo"
      :key="index"
    >
      <div style="float: left; margin-top: -10px">
        <slot name="returnIcon"></slot>
      </div>
      <div class="card-header">
        <el-avatar
          :size="50"
          :src="item.userHead"
          @click="toPerson(item.userId)"
        />
        <div class="info">
          <div>
            <text class="name">{{ item.userName }}</text>
          </div>
          <text class="time">{{ item.time }}</text>
        </div>
      </div>
      <br />
      <div>
        <text class="textcontent">{{ item.text }}</text>
      </div>
      <div class="images" v-if="true">
        <el-image
          class="iamges"
          v-for="(item_image, index) in item.imageList"
          :key="index"
          :src="item_image.path"
          :preview-src-list="item.imagePathList"
          fit="cover"
          style="
            width: 200px;
            height: 160px;
            margin: 0 5px;
            float: left;
            margin-top: 10px;
          "
        />
      </div>
    </el-card>
  </div>
</template>
<script setup>
import { useRoute } from 'vue-router'

import { onMounted, ref, reactive } from 'vue'
import axios from 'axios'
const userDynamic = useRoute()
console.log(userDynamic.query.dynamicId)
const foo = ref([])
var foo1 = reactive({})
onMounted(() => {
  test()
})
function test() {
  axios({
    url:
      'http://localhost:8080/admin/AdminDynamicDetail/' +
      userDynamic.query.dynamicId,
    method: 'get',
    contentType: 'application/json',
    headers: {
      token: localStorage.getItem('token')
    }
  }).then(function (res) {
    foo1 = res.data.data
    console.log(foo1)
    foo.value[0] = foo1
  })
}
</script>

<style hang="scss">
.head {
  height: 100px;
  width: 100%;
  background-color: rgb(167, 221, 253);
  padding-top: 30px;
  font-size: 40px;
}
</style>
